<template>
	<view class="c-content">
		<view class="close-box" @click="close">
			<image src="../../static/images/close-01.png"></image>
		</view>
		<!-- <view class="c-info"> -->
			<swiper class="c-info" circular autoplay="false" circular="true"
					indicator-dots="true" indicator-color="rgba(0, 0, 0, .2)" indicator-active-color="#fff">
				<swiper-item v-for="(item, index) in goodInfo.imgs_s" :key="index" class="client-img">
					<image :src="item ? item : goodsImg" mode=""></image>
				</swiper-item>
			</swiper>
			<!-- <view class="client-img">
				<image :src="customer_info && customer_info.avatar ? customer_info.avatar : goodsImg" mode="scaleToFill"></image> 
				<image src="../../static/temp/222.jpg" mode="scaleToFill"></image>
			</view> -->
		<!-- </view> -->
		<view class="i-info">
			<view class="i-name">{{goodInfo.title}}</view>
			<view class="b-shopname">{{goodInfo.brands_title}} {{goodInfo.categoryname}} {{goodInfo.item_no}}</view>
			<view class="b-price"><text> {{goodInfo.price_bw}}</text></view>
		</view>
		
		<!-- <view class="i-a-info">
			<view v-if="goodInfo.isQty == 1"> 
				<text class="i-title">库存数量：</text>
				<text class="stock">{{goodInfo2.qty}}</text>
			</view>
			<view>
				<text class="i-title">起订数量：</text>
				<text>{{goodInfo.buymin}}</text>
			</view>
			<view> 
				<text class="i-title">警戒库存：</text>
				<text>{{goodInfo.qty_warn}}</text>
			</view>
		</view> -->
		
		<view class="i-b-info">
			<view v-if="goodInfo.onsale == 1"> 
				<text class="i-title">上架设置：</text>
				<text>{{goodInfo.onsale_title}}</text>
			</view>
			<!-- <view> 
				<text class="i-title">经手人：</text>
				<text>{{goodInfo.uid_cpname}}</text>
			</view> -->
			<view>
				<text class="i-title">产品备注：</text>
				<text class="note">{{goodInfo.comment}} </text>
			</view>
		</view>
		
		<view class="i-m-info" v-if="false">
			<view> 
				<text class="i-title">历史销售：</text>
				<text class="note"><text class="more">查看详情</text></text>
			</view>
			<view>
				<text class="i-title">月度销售：</text>
				<text class="note"><text class="more">查看详情</text></text>
			</view>
			<view> 
				<text class="i-title">客户销售：</text>
				<text class="note"><text class="more">查看详情</text></text>
			</view>
		</view>
	</view>
</template>

<script>
	import staticConst from "../../js/const/StaticConst.js";
	export default {
		props:["goodInfo","goodInfo2"],
		data() {
			return {
				goodsImg:staticConst.GOOD_IMG,
			};
		},
		methods:{
			close()
			{
				this.$emit("showCustmInfo");
			},
		}
	}
</script>

<style lang="scss">
	.c-content
	{
		width: 310px;
		height: 100%;
		position: relative;
		background: #F9F9F9;
		.close-box
		{
			width: 15px;
			height: 15px;
			position: absolute;
			padding: 3px;
			background-color: #F9F9F9;
			top:20px;
			right: 20px;
			cursor: pointer;
			image
			{
				width: 100%;
				height: 100%;
			}
		}
		
		.close-box:hover
		{
			background-color: #EEE;
			opacity: .9;
		}
		.close-box:active
		{
			background-color: #DDD;
			opacity: .8;
		}
			
		.c-info
		{
			margin: 0 auto;
			width: 160px;
			height: 160px;
			align-items: center;
			justify-content: center;
			display: flex;
			text-align: center;
			padding-top: 50px;
			.client-img
			{
				width: 160px;
				height: 160px;
				border-radius: 10px;
				overflow: hidden;
				image
				{
					width: 100%;
					height: 100%;
				}
			}
		}
		.i-info
		{
			padding-left: 10px;
			padding-right: 10px;
			padding-bottom: 10px;
			border-bottom: 1px solid #ECECEC;
			font-size: 16px;
			.i-name
			{
				text-align: center;
				font-size: 26px;
				font-weight: bold;
				color: #333;
			}
			.b-price
			{
				text-align: center;
				font-size: 12px;
				color: #F04848;
				text
				{
					font-size: 18px;
				}
			}
			
			.b-shopname,.b-adress
			{
				text-align: center;	
				color: #999;
			}	
			.b-adress
			{
				color: #333;
			}
		}
		
		.i-c-info, 
		{
			text-align: center;
			padding:10px;
			border-bottom: 1px solid #ECECEC;
			color:#999;
			font-size: 16px;
			text
			{
				color: #333;
			}
		}
		
		.i-a-info, .i-b-info, .i-m-info
		{
			// text-align: center;
			padding:10px;
			border-bottom: 1px solid #ECECEC;
			font-size: 16px;
			view
			{
				padding-left: 30px;
				.i-title
				{
					color:#999;
					display: inline-block;
					width: 80px;
					text-align-last:justify;
					text-align:justify;
					text-justify:distribute-all-lines; // 这行必加，兼容ie浏览器
				}
				.note
				{
					color:#999;
					.more
					{
						padding-left: 5px;
						color: #3388FF;
						font-size: 13px;
					}
				}
				text
				{
					color: #333;
				}
				.stock
				{
					color: #3388FF;
				}
			}
		}
		
		.i-c-s-info
		{
			text-align: center;
			padding:10px;
			color:#999;
			font-size: 16px;
			text
			{
				color: red;
			}
		}
	
	}
	
</style>
